<!DOCTYPE html>
<html lang="en">
<head>
    <!--破解防盗链-->
    <meta name="referrer" content="never">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人主页</title>
    <link rel="stylesheet" href="../css/mine.css">
    <link rel="stylesheet" href="../css/top-bar-status.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="shortcut icon" href="https://img3.doubanio.com/favicon.ico">
    <script type="module" src="../js/components.js" defer></script>
    <script src="../js/mine.js" type="module" defer></script>
</head>
<body>
    <div id="top-nav-items">
        <ul id="top-nav-ul" style="display:inline-block;">
            <li>
                <span class="top-nav-item" onclick="alert('没有主页！哼😕')">豆瓣</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('就知道读书！')">读书</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="window.location.href = './index.html'">电影</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('就知道听音乐！')">音乐</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('啊这...我不好说了')">同城</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('就知道小组！')">小组</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('跟读书有区别吗？哼😕')">阅读</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('什么年代了还听广播 原来我也听那没事了')">FM</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('没时间啦 万策尽啦！！！😱')">时间</span>
            </li>
            <li>
                <span class="top-nav-item" onclick="alert('拒绝超前消费!')">豆品</span>
            </li>
        </ul>
        <div id="top-nav-right-items">
            <ul id="top-nav-right-ul">
                <li>
                    <span class="top-nav-item" onclick="alert('flutter在学了😭')">下载豆瓣客户端</span>
                </li>
                <li>
                    <span class="top-nav-item" id="login-nav-item">登录/注册</span>
                </li>
            </ul>
        </div>
    </div>
    <div id="search-area">
        <div id="search-content">
            <div id="nav-logo" onclick="window.location.href = './index.html'"></div>
            <div id="nav-search">
                <fieldset style="display: inline-flex;border: 0px;">
                    <label for="inp-query"></label>
                    <div class="inp">
                        <input id="inp-query" class="card" name="search_text" size="22" maxlength="60"
                                placeholder="搜索电影、电视剧、综艺、影人" autocompelete="off">
                    </div>
                    <div class="inp-btn">
                        <input type="submit" value="搜索">
                    </div>
                </fieldset>
            </div>
        </div>
    </div>
    <div id="content-body">
        <div id="user-info" class="card">
            <div id="user-avatar"></div>
            <div id="fragment-user-info">
                <h1 id="user-id"></h1>
                <p id="user-description"></p>
                <div id="info-box">
                    <div style="display: flex;align-items: center;margin: 20px 0px 0px 0px;">
                        <embed src="../images/phone.svg" type="image/svg+xml" />
                        <p id="phone-number" style="display: inline;margin-left: 10px;"></p>
                    </div>
                    <div style="display: flex;align-items: center;margin: 20px 0px 0px 0px;">
                        <embed src="../images/email.svg" type="image/svg+xml" />
                        <p id="email" style="display: inline;margin-left: 10px;"></p>
                    </div>
                </div>
                <div id="edit-button" class="button">Edit Profile</div>
                <div id="logout-button" class="button">Logout</div>
            </div>
        </div>
        <!-- 想看/看过 -->
        <div id="infomation-board" class="card">
            <ul id="tab">
                <li id="want-to-watch-tab" class="tab-item selected">想看</li>
                <li id="watched-tab" class="tab-item">看过</li>
                <li id="my-comment-tab" class="tab-item">我的影评</li>
                <li id="movie-list-tab" class="tab-item" style="border-right:0px;">片单</li>
            </ul>
            <!--作为fragment的容器-->
            <div id="pager">
                
            </div>
        </div>
    </div>
</body>
</html>